<template>
	<view class="certDetail">
		<!-- 证书详情信息 -->
		<view  class="cert-details">
			<!-- 证书标题 -->
			<view class="cert-title">
				{{ detail.title }}
				<view class="title-line"></view>
			</view>
		
			<!-- 报名时间 -->
			<view class="info-section">
				<view class="info-title">报名时间</view>
				<view class="info-content" @tap="showRegistrationDetail">
					{{formatDate(detail.registrationTime) }}
				</view>
			</view>
		
			<!-- 考试介绍 -->
			<view class="info-section">
				<view class="info-title">考试介绍</view>
				<view class="info-content" @tap="showExamIntro">
					{{ detail.examIntroduction }}
				</view>
			</view>
		
			<!-- 考试大纲 -->
			<view class="info-section">
				<view class="info-title">考试大纲</view>
				<view class="info-content" @tap="showExamOutline">
					{{ detail.examSyllabus }}
				</view>
			</view>
		
			<!-- 考试日程 -->
			<view class="info-section">
				<view class="info-title">考试日程</view>
				<view class="info-content" @tap="showSchedule">
					{{formatDate(detail.examSchedule)}}
				</view>
			</view>
		
			<!-- 真题下载 -->
			<view class="info-section">
				<view class="info-title">真题下载</view>
				<view class="info-content download-link" @tap="handleDownload(detail.pastPapersDownload)">
					点击下载历年真题
				</view>
			</view>
		
			<!-- 考试常见问题 -->
			<view class="info-section">
				<view class="info-title">医考百问</view>
				<view class="info-content" @tap="showFAQ">
					查看常见问题解答
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getCertDetail
	} from "@/api/index.js"
	import formatDateString from '../../common/date.js'
	export default {
		data() {
			return {
				detail: {}
			};
		},
		async onLoad(option) {
			if (option.id) {
				let res = await getCertDetail(option.id)
				this.detail=res.data.data
				console.log(res, '???????????????');
			}
		
		},
		computed: {
			formatDate() {
				return (value) => {
					return formatDateString(value)
				}
			}
		},
		methods: {
			showRegistrationDetail() {
				uni.showToast({
					title: '暂无相关内容',
					icon: 'none'
				})
			},
		
			showExamIntro() {
				uni.showToast({
					title: '暂无相关内容',
					icon: 'none'
				})
			},
		
			showExamOutline() {
				uni.showToast({
					title: '暂无相关内容',
					icon: 'none'
				})
			},
		
			showSchedule() {
				uni.showToast({
					title: '暂无相关内容',
					icon: 'none'
				})
			},
		
			handleDownload(url) {
				uni.setClipboardData({
					data: 'http://localhost:3000/'+url, //data是需要复制的数据
					showToast: false, //配置是否弹出提示，默认弹出提示
					success: function() {
						console.log('success'); //复制成功的回调函数
						uni.showToast({
							title: '已复制真题链接',
							icon: 'none'
						})
					},
					fail: function() {
						console.log('fail'); //复制失败的回调函数
					},
					complete: function() {
						console.log('complete'); //接口调用结束的回调函数（调用成功、失败都会执行）
					},
				})
			},
		
			showFAQ() {
				uni.showToast({
					title: '暂无相关内容',
					icon: 'none'
				})
			}
		},
	}
</script>

<style lang="scss">
.certDetail{
	.cert-details {
		background: #fff;
		border-radius: 8rpx;
		padding: 30rpx;
	}
	
	.cert-title {
		font-size: 36rpx;
		font-weight: bold;
		color: #333;
		margin-bottom: 30rpx;
	}
	
	.title-line {
		height: 4rpx;
		background: #f0f0f0;
		margin-top: 20rpx;
	}
	
	.info-section {
		margin-bottom: 30rpx;
		padding: 20rpx;
		border: 2rpx solid #eee;
		border-radius: 8rpx;
	}
	
	.info-title {
		font-size: 28rpx;
		color: #666;
		margin-bottom: 16rpx;
	}
	
	.info-content {
		font-size: 32rpx;
		color: #333;
		padding: 10rpx 0;
	}
	
	.download-link {
		color: #4a90e2;
		text-decoration: underline;
	}
}
</style>